import React, { Component } from 'react';

import "./Btnbar.scss"


class Btnbar extends Component {
    constructor(props) {
        super(props)
        this.state = {
            index:0,
            arrone: [
                { name: '店铺' },
                { name: '分类' },
                { name: '全部商品' },
                { name: '购物车' },
                { name: '个人中心' },
            ]
        }
    }

    btn(index){
        this.setState({
             index:index
        })
    }

    render() {
        return (
            <div className='button'>
                {
                    this.state.arrone.map((item,index)=>{
                        return(
                            <div className= {this.state.index == index ? "color" : "btn"} onClick={()=>{
                                this.btn(index)
                            }}>
                                {item.name}
                            </div>
                        )
                    })
                }
            </div>
        );
    }
}

export default Btnbar;